<template>
  <div class="home">
<div id="nowing" v-for="(item,index) in Lists" v-bind:key="index">
	<div class="inbox">
		
	
	<!-- <img src="/public/images/+item.src" > -->
	<img :src="item.Src" >
	<div id="content">
		<p class="frist">{{item.MovieNmae}}</p>
		<p class="second">{{item.whatcher}}人想看</p>
		<p class="third">主演：  {{item.yanyuan}}</p>
		<p class="end">{{item.time}}</p>
	</div>
	<div class="btn">
		<button type="button">预售</button>
	</div>
	
</div>
	</div>
	
</div>
</template>
<style scoped>
	.home{
		margin-bottom: 70px;
	}
	#nowing{
			border-bottom: solid 1px  #999999;
			margin-top: 10px;
	}
	.inbox{
		display: flex;
		flex-direction: row;
		margin-bottom: 10px;
	
	}
	.frist{
		font-size: 18px;
		font-weight: bold;
	}
	.second{
		color: #666;
		font-size: 14px;
		/* margin-right: 20px; */
	}
	span{
		color: #FF9900;
		font-weight: bold;
		margin-left: 5px;
	}
	.third{
		color: #666;
		font-size: 14px;
		width: 200px;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
	}
	.end{
		color: #666;
		font-size: 14px;
	}
	#nowing img{
		height: 130px;
		width: 110px;
	}
	#content{
		flex: 1;
		display: flex;
		flex-direction: column;
		margin-left: 10px;
		
	}
	.btn{
		display: flex;
		margin: 10px;
		height: 130px;
		width: 60px;
		line-height: 130px;
		/* height: 80px; */
		/* border: #2C3E50 1px solid; */
	}
	button{
		background-color: #a2dcff;
		height: 40px;
		width: 50px;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: auto 10px;
		border-radius: 10px;
	}
	p{
		overflow: hidden;
		flex: 1;
		
		
	}
	
</style>
<script>
	export default{
		data(){
			return{
				Lists:[
					{
						Src:'/images/007.png',
						MovieNmae:'佐罗和麦克斯',
						whatcher:'46465',
						yanyuan:'格兰特·鲍尔 艾米·斯马特 博伊德·肯斯特纳',
						time:'未来30天内上映'
					},
					{
						Src:'/images/008.png',
						MovieNmae:'废材特工',
						whatcher:'64645',
						yanyuan:' 西尔维斯特·史泰龙，杰森·斯坦森，梅尔·吉布森今天50家影院放映750场',
						time:'未来30天内上映'
					},
					{
						Src:'/images/009.png',
						MovieNmae:'凤凰城遗忘录',
						whatcher:'42465',
						yanyuan:'Clint Jordan',
						time:'未来30天内上映'
					},
					{
						Src:'/images/010.png',
						MovieNmae:'新灰姑娘',
						whatcher:'46465',
						yanyuan:'Cassandra Morris，Kristen Day',
						time:'未来30天内上映'
					},
					{
						Src:'/images/011.png',
						MovieNmae:'鲨卷风4：四度觉醒',
						whatcher:'38465',
						yanyuan:'塔拉·雷德，Ian Ziering，Masiela Lusha',
						time:'未来30天内上映'
					},
					{
						Src:'/images/012.png',
						MovieNmae:'全境警戒',
						whatcher:'46465',
						yanyuan:'戴夫·巴蒂斯塔，布兰特妮·斯诺，Angelic Zambrana',
						time:'未来30天内上映'
					}
					
				]
			}
		}
	}
</script>

